<template>
<div>
    <el-menu :default-active="active" mode="horizontal" @select="setNav" text-color="#333">
        <el-menu-item index="1">基础信息</el-menu-item>
        <el-menu-item index="2">证照信息</el-menu-item>
    </el-menu>
    <div class="info" v-show="active == '1'">
        <div class="hd">基本信息</div>
        <div class="bd">
            <div class="row">
                <div class="k">用户ID：</div>
                <div class="v">{{baseData ? baseData.physicalTravelId : ''}}</div>
            </div>
            <div class="row">
                <div class="k">企业名称：</div>
                <div class="v">{{baseData ? baseData.companyName : ''}}</div>
            </div>
            <div class="row">
                <div class="k">公司所在地：</div>
                <div class="v">{{baseData ? baseData.companyAddress : ''}}</div>
            </div>
            <div class="row">
                <div class="k">第一联系人：</div>
                <div class="v">{{baseData ? baseData.linkUser : ''}}</div>
            </div>
            <div class="row">
                <div class="k">第一联系人联系电话：</div>
                <div class="v">{{baseData ? baseData.linkPhone : ''}}</div>
            </div>
        </div>
    </div>
    <div class="info" v-show="active == '2'">
        <div class="hd">证照信息</div>
        <div class="bd">
            <div class="row">
                <div class="k">营业执照号：</div>
                <div class="v">{{authData ? authData.businessLicenNum : ''}}</div>
            </div>
            <div class="row">
                <div class="k">营业执照有效期：</div>
                <div class="v">{{authData ? authData.businessLicenEndDate : ''}}</div>
            </div>
            <div class="row">
                <div class="k">营业执照照片：</div>
                <div class="v">
                    <img :src="authData ? authData.businessLicenPhotos : ''">
                </div>
            </div>
            <div class="row">
                <div class="k">经营许可证编号：</div>
                <div class="v">{{authData ? authData.businessPermitNum : ''}}</div>
            </div>
            <div class="row">
                <div class="k">经营许可证：</div>
                <div class="v">
                    <img :src="authData ? authData.businessPermitPhotos : ''">
                </div>
            </div>
            <div class="row">
                <div class="k">经营许可范围：</div>
                <div class="v">{{authData ? authData.businessPermitRange : ''}}</div>
            </div>
            <div class="row">
                <div class="k">法人姓名：</div>
                <div class="v">{{authData ? authData.legalName : ''}}</div>
            </div>
            <div class="row">
                <div class="k">法人身份证号：</div>
                <div class="v">{{authData ? authData.legalCardNum : ''}}</div>
            </div>
            <div class="row row2">
                <div class="item">
                    <div class="k fl">经营许可证：</div>
                    <div class="v fl">
                        <img :src="authData ? authData.businessPermitPhotos : ''">
                    </div>
                </div>
                <div class="item">
                    <div class="k fl">旅行社责任险：</div>
                    <div class="v fl">
                        <img :src="authData ? authData.travelDutyInsuranceUrl : ''">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</template>

<script>
export default {
  data () {
    return {
      active: '1',
      baseData: null,
      authData: null
    }
  },
  created () {
    this.getData()
  },
  methods: {
    setNav (idx) {
      this.active = idx
    },
    getData () {
      Promise.all([
        this.$http.get('/physicaltravel/tphysicaltravel/getCurrentLoginPhysicalTravel'),
        this.$http.get('/PhysicalTravel/tPhysicalTravelauthen/getCurrentLoginPhysicalTravelAuth')
      ]).then(values => {
        this.baseData = values[0].data.data
        this.authData = values[1].data.data
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.info {
    margin-top: 10px;

    .hd {
        height: 50px;
        line-height: 50px;
        background: #DBEDF6;
        font-weight: bold;
        padding: 0 20px;
        font-size: 16px;
    }

    .bd {
        background: #fff;
        padding: 20px;

        .row {
            display: flex;
            padding: 10px 0;

            .k {
                color: #999;
                width: 150px;
                text-align: right;
                padding-right: 10px;
            }

            .v {
                flex: 1;
                font-weight: 600;

                img {
                    width: 145px;
                    display: inline-block;
                }
            }
        }

        // .row2 {

        // }
    }
}
</style>
